<!--
 * @Author: chunlai
 * @Date: 2025-02-13 15:03:23
 * @LastEditTime: 2025-09-10 17:34:40
 * @LastEditors: minsheng_insurance_agency_zhoucl
 * @FilePath: \02.bldinsure\src\views\preinsure\exam\FuXing.vue
 * @Description: 普通人身保险适当性评估问卷
-->
<template>
  <div class="h100v bgc-f pd12_lr pdbt_20">
    <div class="page-title">普通人身保险适当性评估问卷</div>
    <div>
      <p class="ti_2 ft16">
        感谢您选择我公司投保该产品。本问卷是履行我公司适当性职责的重要环节，可协助评估您购买保险产品、享受保险服务的范围和额度，以便确认您所投保的保险产品和承保保额与您的保障需求及支付能力相匹配。请您如实填写相关信息并对信息的真实性负责，我公司根据您提供的信息开展适当性风险评估。
      </p>
      <!-- <br><br>
      <p>您投保的信息如下：</p> -->
    </div>
    <div class="ques-list" v-if="quesList.length > 0">
      <div
        class="ques-item"
        v-for="(item, index) in quesList"
        :key="`ques-${index}`"
        :id="`exam${index}`"
      >
        <div class="item-name">
          {{ `${index + 1}.${comptedName(item.text)}` }}
        </div>
        <div class="answer-list">
          <van-radio-group v-model="item.value">
            <van-radio
              :name="opt.value"
              shape="square"
              checked-color="#f54040"
              icon-size="14px"
              v-for="(opt, j) in item.radios"
              :key="`asks-${j}`"
            >
              {{ `${opt.label}` }}
            </van-radio>
          </van-radio-group>
        </div>
      </div>
    </div>
    <div class="question-btn" :class="askAll ? 'active' : ''" @click="submit">下一步</div>
  </div>
</template>

<script>
import { examInsureMixin } from "./mixs";
export default {
  name: "FuXing",
  components: {},
  data() {
    return {};
  },
  computed: {},
  watch: {},
  mixins: [examInsureMixin],
  created() {},
  mounted() {},
  methods: {},
};
</script>
<style lang="less" scoped>
.page-title {
  text-align: center;
  font-size: 18px;
  padding: 25px 0;
  font-weight: bold;
}
.ques-item {
  padding: 15px 0;
  border-bottom: 1px solid #f5f5f5;
  .item-name {
    font-size: 15px;
    line-height: 22px;
  }
}
.question-btn {
  width: 100%;
  height: 45px;
  line-height: 45px;
  text-align: center;
  color: #fff;
  font-size: 17px;
  margin-top: 45px;
  border-radius: 4px;
  background-color: #dee2ea;
  &.active{
    background-color: #377aff;
  }
}
.answer-list {
  /deep/.van-radio {
    margin-top: 10px;
    align-items: flex-start;
  }
  /deep/.van-radio__icon {
    margin-top: 2px;
  }
}
</style>
